<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	template="../templates/ui.xhtml">

	<ui:define name="content">
		<h1 class="title ui-widget-header ui-corner-all">Calendar</h1>
		<div class="entry">
            <p>When a date is selected, a server side listener can be invoked using dateSelect event.</p>
            
			<h:form id="form">
				
				<p:growl id="growl" showDetail="true" />
				
				<p:calendar value="#{calendarBean.date1}" mode="inline" id="inlineCal">
                    <p:ajax event="dateSelect" listener="#{calendarBean.handleDateSelect}" update="growl" />
                </p:calendar>
			
			</h:form>
	
			<h3>Source</h3>
			<p:tabView>
				<p:tab title="calendarAjax.html">
<pre name="code" class="xml">
&lt;h:form id="form" &gt;

    &lt;p:growl id="growl" showDetail="true"/&gt;

    &lt;p:calendar value="\#{calendarBean.date1}" mode="inline" id="inlineCal"&gt;
        &lt;p:ajax event="dateSelect" listener="\#{calendarBean.handleDateSelect}" update="growl" /&gt;
    &lt;/p:calendar&gt;

&lt;/h:form&gt;
</pre>
				</p:tab>
				
				<p:tab title="CalendarBean.java">
<pre name="code" class="java">
package org.primefaces.examples.view;

import java.text.SimpleDateFormat;
import java.util.Date;

import javax.faces.application.FacesMessage;
import javax.faces.context.FacesContext;

import org.primefaces.event.SelectEvent;

public class CalendarBean {

	private Date date1;
	
	public Date getDate1() {
		return date1;
	}

	public void setDate1(Date date1) {
		this.date1 = date1;
	}

	public void handleDateSelect(SelectEvent event) {
		FacesContext facesContext = FacesContext.getCurrentInstance();
		SimpleDateFormat format = new SimpleDateFormat("d/M/yyyy");
		facesContext.addMessage(null, new FacesMessage(FacesMessage.SEVERITY_INFO, "Date Selected", format.format(event.getObject())));
	}
}
	</pre>
				</p:tab>
			</p:tabView>
				
			
			
			
		
         </div>
        
	</ui:define>
</ui:composition>
